<script lang="ts"></script>

<template>
  <view class="swiper">
    <swiper
      autoplay
      circular
      indicator-dots
      interval="2000"
      indicator-color="#fff"
      indicator-active-color="#f3514f"
    >
      <swiper-item v-for="(item, index) in advertiseList" :key="index">
        <image :src="item.url" />
      </swiper-item>
    </swiper>
  </view>
</template>

<script lang="ts" setup>
// 广告区域
const advertiseList = [
  {
    url: "http://192.168.31.72:9000/books-bucket/static/advertise/ad1.png",
  },
  {
    url: "http://192.168.31.72:9000/books-bucket/static/advertise/ad2.png",
  },
  {
    url: "http://192.168.31.72:9000/books-bucket/static/advertise/ad3.png",
  },
];
</script>

<style lang="scss" scoped>
// 轮播图区域样式
.swiper {
  border-radius: 10rpx;
  overflow: hidden;
  background-color: #cfcfcf;
  margin: 10rpx;
  height: 360rpx;
  swiper {
    // background-color: skyblue;

    swiper-item {
      image {
        width: 100%;
        height: 100%;
        border-radius: 10rpx;
      }
    }
  }
}
</style>
